<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" th:href="@{/css/creation/draftbox.css}" >
    <link rel="stylesheet" th:href="@{/css/creation/Dialog.css}" >
    <script src='https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js'></script>
    <script src='/js/creation/Dialog.js'></script>
    <title>草稿箱</title>
</head>
<body>
<div id="contain1">
    <div id="tablepart" th:fragment="copy">
        <table id="tablecard">
            <thead>
                <th>标题</th>
                <th >发布状态</th>
                <th >点赞数</th>
                <th >阅读数</th>
                <th >操作</th>
                <th >操作</th>
            </thead>
            <tbody>
            <tr style="height: 30px"align="center" th:each="yw:${yuanwenlist}" >
                <td th:text="${yw.getTitle()}"></td>
                <td th:text="${yw.getStatus()}"></td>
                <td>0</td>
                <td>0</td>
                <td><button th:value="${yw.getObjectid()}" class="buttoncss2">编辑</button></td>
                <td><button th:value="${yw.getObjectid()}" th:id="${yw.getObjectid()}" class="buttoncss3">删除</button></td>
            </tr>
            </tbody>
        </table>
    </div>

    <div class="dialog" id="delallpartdialog">
        <div class="title">
            提示
        </div>
        <div class="content">
            <img alt="" src="/img/creation/tips.png" width="60px" height="60px">
            <span>你真的要删除该园文吗？</span>
        </div>
        <div class="bottom">
            <input type="button" id="deletebut" value="确定" >
            <input type="button" id="closeDialog" value="取消" class="btnnoOk">
        </div>
    </div>

    <div class="dialog" id="delallpartdialog2">
        <div class="title">
        </div>
        <div class="content">
            <img alt="" src="/img/creation/tips.png" width="60px" height="60px">
            <span id="span2"></span>
        </div>
        <div class="bottom">
            <input type="button" id="deletebut2" value="确定" >
        </div>
    </div>

    <div id="pagemain" >
        <div>
            <button id="lastpage" onclick="lastpagefun()">
                <
            </button>
        </div>
        <div id="pagearr">

        </div>
        <div>
            <button id="nextpage" onclick="nextpagefun()">
                >
            </button>
        </div>
    </div>
</div>
    <script>
        pagenow=1;
        num=[[${pagenumber}]];
        console.log(num);
        for (var i=1;i<=num;i++){
            if(i==1) {
               button=document.createElement('button');
               button.id=i;
               button.textContent=i;
               button.className='buttoncss1';
               button.onclick=pageclick;
            }
            else {
                button=document.createElement('button');
                button.id=i;
                button.textContent=i;
                button.className='buttoncss';
                button.onclick=pageclick;

            }
            $('#pagearr').append(button);
        }

        function pageclick(){
            pagenow=parseInt(this.id);
            $('.buttoncss1').removeClass("buttoncss1").addClass("buttoncss");
            this.className="buttoncss1";
            sentajax(pagenow);
        }

        function lastpagefun() {
            if(pagenow!=1)
            {
                pagenow=pagenow-1;
                $('.buttoncss1').removeClass("buttoncss1").addClass("buttoncss");
                var idbut=document.getElementById(pagenow);
                idbut.className="buttoncss1";
                sentajax(pagenow);
            }
        }

        function nextpagefun() {
            if(pagenow!=num){
                pagenow=pagenow+1;
                $('.buttoncss1').removeClass("buttoncss1").addClass("buttoncss");
                var idbut=document.getElementById(pagenow);
                idbut.className="buttoncss1";
                sentajax(pagenow);
            }
        }


        function sentajax(page) {
            $.ajax({
                url:"/yuanwen/creationdraftpage",
                type:"post",
                data:{
                    numberpage:page
                },
                success: function (data) {
                    $("#tablepart").html(data);
                    $("tr").mouseover(function(){
                        $(this).addClass("hoverRow");
                    });
                    $("tr").mouseout(function(){
                        $(this).removeClass("hoverRow");
                    });
                    var btns=$('.buttoncss2');
                    for(var i=0;i<btns.length;i++){
                        btns[i].onclick=editor;
                    }
                    var btns3=$('.buttoncss3');
                    var objectval;
                    for(var i=0;i<btns.length;i++){
                        btns3[i].onclick=delete1;
                    }
                    $(".buttoncss3").click(function (id) {
                        $("#delallpartdialog").css("display", "block");
                    })
                }
            })
        }

        var btns=$('.buttoncss2');
        for(var i=0;i<btns.length;i++){
            btns[i].onclick=editor;
        }

        function editor() {
            console.log("编辑按钮被执行了");
            objectval=this.value;
            console.log(objectval);
            $.ajax({
                url:"/yuanwen/creationmain",
                type:"post",
                data:{
                    objectid:objectval
                },
                success: function (data) {
                    $('#header').html("创作");
                    $("#cretionmain").html(data);
                }
            })
        }

        var btns3=$('.buttoncss3');
        var objectval;
        for(var i=0;i<btns.length;i++){
            btns3[i].onclick=delete1;
        }

        function delete1() {
            objectval=this.value;
            console.log(objectval);
        }

        $(document).ready(function(){
            $("tr").mouseover(function(){
                $(this).addClass("hoverRow")
            });
            $("tr").mouseout(function(){
                $(this).removeClass("hoverRow");
            });
        });
    </script>
</body>
</html>